<template>
	<view class="add">
		<form @submit="onSubmit">
			<view class="item">
				<input v-model="formValue.name" type="text" name="name" placeholder="请输入作者">
			</view>
			
			<view class="item">
				<input v-model="formValue.title" type="text" name="title" placeholder="请输入标题">
			</view>
			
			<view class="item">
				<textarea v-model="formValue.content" name="content" placeholder="请输入详细内容"></textarea>
			</view>
			
			<view class="item">
				<uni-file-picker 
					v-model="imageValue" 
					fileMediatype="image" 
					mode="grid" 
					limit="3"
					@success="uploadSuccess" 
				/>
			</view>
			
			<view class="item">
				<button form-type="submit" type="primary" :disabled="inDisabled(formValue)" >提交</button>
			</view>
			
		</form>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				
				imageValue:[],
				
				formValue:{
					name:"",
					title:"",
					content:""
				},
			
				picurls:[]
			};
		},
		
		onLoad() {
		},
		
		methods: {
			//图片上传成功
			uploadSuccess(e){
				this.picurls = e.tempFilePaths
			},
			
			
			upload(){
				this.$refs.files.upload()
			},
			
			// 获取上传状态
			select(e){
				console.log('选择文件：',e)
			},
			// 获取上传进度
			progress(e){
				console.log('上传进度：',e)
			},
			
			// 上传成功
			success(e){
				console.log('上传成功',e)
			},
			
			// 上传失败
			fail(e){
				console.log('上传失败：',e)
			},
			
			//判断按钮是否禁用
			inDisabled(obj){
				for(let key in obj){
					if(!obj[key]){
						return true;
					}
				}
			},
			//点击提交
			onSubmit(e){
				console.log(e)
				let detail=e.detail.value;
				
				uniCloud.callFunction({
					name:"addFun",
					data:{
						detail,
						picurls:this.picurls
					}
				}).then(res=>{
					uni.showToast({
						title:"发布成功"
					})
					
					setTimeout(()=>{
						
						uni.reLaunch({
							url:"/pages/index/index"
						})
					},800)
					
				})
			}
		}
	}
</script>

<style>
.add{
	padding: 30rpx;
}

.add .item{
	padding-bottom: 20rpx;
}

.add .item input,textarea{
	border:2px solid #eee;
	height: 80rpx;
	padding: 0 20rpx;
}

.add .item textarea{
	height: 200rpx;
	width: 100%;
	box-sizing: border-box;
}

</style>
